<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
<title>imageCode测试</title>
</head>
<link rel="stylesheet" type="text/css" href="imageCode/imageCode.css" />
<script type="text/javascript" src="imageCode/jquery.js"></script>
<script type="text/javascript" src="imageCode/imageCode.js"></script>
<style type="text/css">
.f_btn.green {
    border: 1px solid #43b57a;
    background: #43b57a;
}
.f_btn {
    position: relative;
    display: inline-block;
    font-size: 13px;
    font-family: "Microsoft Yahei";
    height: 30px;
    line-height: 30px;
    color: #fff;
    text-decoration: none;
    text-align: center;
    padding: 0 30px;
    border: 1px solid #45aaf9;
    background: #45aaf9;
    cursor: pointer;
    border-radius: 3px;
    outline: 0;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: middle;
    }
pre {
	font-size: 12px;
	line-height: 20px; /* 行距 */
	overflow: auto; /* 超出宽度出现滑动条 */
	overflow-Y:hidden; /* 作用是隐藏IE的右侧滑动条 */
	background-color: burlywood;
}

</style>
<body >
<em class="f_btn green" id="imageCode" style="margin: 150px">图片验证码</em>

<pre>
	<code class="language-markup">
	&lt;em class="f_btn green" id="imageCode">图片验证码&lt;/em>
	</code>
</pre>
<pre>
	<code class="language-js">
	// 点击验证
	$('#imageCode').click(function() {
		$(this).imageCode({
			callback: function(data) {	// 回调函数
				// data.result： true表示验证成功
				console.log(data);
			}
		});
	});
	</code>
</pre>

<script type="text/javascript" src="imageCodeDemo.js"></script>
</body>
</html>
